<template>
  <div id="treatmentplan">
    <van-nav-bar title="临床治疗方案" left-arrow left-text="返回" @click-left="onClickLeft" fixed placeholder>
      <!-- <template #right>
        <span @click="$router.push(`/HistoricalPlan/${form.pid}`)">历史方案</span>
      </template> -->
    </van-nav-bar>
    <div class="main">
      <div>
        <!-- <van-form @submit="onSubmit"> -->
          <div class="nav">
            <van-field v-model="form.title" label="营养标题" placeholder="暂无标题" readonly />
          </div>
          <div class="nav">
            <van-field
              readonly
              clickable
              :value="(form.zldate || '').split(' ')[0]"
              name="calendar"
              label="营养时间"
              placeholder="暂无数据"
            />
          </div>
          <div class="nav">
            <div class="title">临床治疗方案</div>
            <van-field
              v-model="form.fangan"
              autosize
              rows="4"
              type="textarea"
              placeholder="暂无数据"
              readonly
            />
          </div>
          <div class="nav">
            <div class="title">特别注意</div>
            <van-field
              v-model="form.zhuyi"
              autosize
              rows="4"
              type="textarea"
              placeholder="暂无数据"
              readonly
            />
          </div>
          <!-- <van-button type="info" native-type="submit">提交</van-button>
        </van-form> -->
      </div>
    </div>
  </div>
</template>
  
  <script>
    import { fangAnDetails } from "@/apis/treatmentplan";
    export default {
      data() {
        return {
          showCalendar: false,
          minDate: new Date(1970, 1, 1),
          value: new Date(),
          detailId: null,
          form:[]
        };
      },
      methods: {
       records() {
          fangAnDetails({ id: this.$route.params.id })
            .then((res) => {
              console.log(res)
              this.form = res.data.list
            })
            .catch((err) => {
              if(err.msg){
                this.$toast(err.msg);
              }else{
                this.$toast("网络错误"); 
              }
            });
        },
        onClickLeft() {
          this.$router.go(-1); //返回上一层
        },
        onConfirm(date) {
          this.form.zldate = `${date.getFullYear()}/${
            date.getMonth() + 1
          }/${date.getDate()}`;
          this.showCalendar = false;
        },
      },
      mounted() {
        this.records();
      },
      created() {
       this.detailId = this.$route.params.id;
       console.log('id:'+ this.$route.params.id)
      },
    };
  </script>
  
  <style lang="less">
    #treatmentplan {
      text-align: left;
      color: #404040;

      .van-nav-bar__left {
        .van-icon,.van-nav-bar__text {
          color: #404040;
        }
      }
      .van-divider {
        border-color: transparent;
        margin: 10px 0;
      }
      .van-nav-bar__right {
        color: #3660c8;
        font-size: 14px;
      }
      .main {
        margin: 15px;
        .nav {
          margin-bottom: 15px;
          background-color: #fff;
          border-radius: 8px;
          .title {
            padding: 20px 0 0px 15px;
            font-size: 15px;
          }
        }
        .van-cell {
          padding: 20px 15px;
          border-radius: 8px;
          &::after {
            right: 0;
            left: 0;
          }
          .van-field__label {
            font-size: 15px;
            width: 60px;
          }
        }
      }
      .van-button {
        width: 100%;
        margin-top: 20px;
        border-radius: 3px;
        font-size: 16px;
        height: 50px;
        line-height: 50px;
      }
    }
  </style>
  